var path = require("path");
var webpack = require("webpack");
var ExtractTextWebpackPlugin = require('extract-text-webpack-plugin');

module.exports = {
    entry: {
        "pageA": "./src/pageA.js",
    },
    output: {
        path: path.resolve(__dirname, "./dist"),
        publicPath: "./dist/",
        filename: "[name].js", //初始化打包的文件名
        chunkFilename: '[name].js' //动态打包的文件名
    },
    module: {
        rules: [{
            test: /\.css$/,
            use: ExtractTextWebpackPlugin.extract({ //即可以把需要的css提取出来，也可以把处理后面的css-loader
                fallback: { //不提取的时候用什么的样式加载到页面中（如果不提取出来,用什么文件处理）
                    loader: "style-loader",
                    options: {
                        singleton: true,
                    }
                },
                use: [{ //既可以把样式提取出来，又可以使用后面的loader（如果提取出来用深什么文件处理）
                    loader: "css-loader",
                    options: {
                        modules: true,
                        localIdentName: '[path][name]_[local]_[hash:base64:5]'
                    }
                }]

            })
        }, {
            test: /\.js$/,
            exclude: /node_modules/,
            loader: 'babel-loader',
            options: {
                presets: ['es2015'],
                plugins: ['syntax-dynamic-import']
            }
        }]

    },
    plugins: [
        new ExtractTextWebpackPlugin({
            filename: "[name].min.css", //规定打包后css叫什么名称
            allChunks: false //给css指定一个提取的范围，如果为true表示所有import的css都会提取出来,默认是false，只会提取初始化的css，异步加载的就认为不是初始化
        }),
    ]
}